<template>
  <div id="app">
    <h2>应用标题</h2>
    <person-list  :persons="persons"/>
  </div>
</template>

<script>
import PersonList from './components/PersonList.vue'
export default {
  components: { PersonList },
  name: 'App',
  data () {
    return {
      persons: [
        {id: '001', name: 'Tom', age: 12},
        {id: '002', name: 'Jack', age: 14},
        {id: '003', name: 'Bob', age: 13}
      ]
    }
  }
}
</script>

<!--作用域样式: 影响当前组件和子组件的根标签-->
<style scoped>
  #app h2 {
    color: pink;
  }
  #app div {
    border: 1px solid #ccc;
  }
</style>
